<template>
	<view class="content">
		<view class="img-box">
			<image class="img" :src="equipmentInfo.img"></image>
		</view>
		<view class="equipment-info">
			<p>设备型号：{{equipmentInfo.type}}</p>
		</view>
		<view class="bottom-box">
			<view class="bottom ">
				<router-link to="/pages/views/user/Suggest/Suggest" class="link-box">
					<view class="bottom-icon-box">
						<image src="../../../../static/icon/summary_info/u1.svg" class="img-icon"></image>
					</view>
					<p>
						维护教程
					</p>
				</router-link>
			</view>
			<view class="bottom bottom-line ">
				<router-link to="/pages/views/user/Suggest/Suggest" class="link-box">
					<view class="bottom-icon-box">
						<image src="../../../../static/icon/summary_info/u2.svg" class="img-icon"></image>
					</view>
					<p>
						设备报修
					</p>
				</router-link>
			</view>
			<view class="bottom ">

				<router-link to="/pages/views/user/Suggest/Suggest" class="link-box">
					<view class="bottom-icon-box">
						<image src="../../../../static/icon/summary_info/u3.svg" class="img-icon"></image>
					</view>
					<p>
						投诉建议
					</p>
				</router-link>
			</view>
		</view>
		<view class="logo-box">
			<image src="../../../../static/logo.png" class="logo-icon"></image>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				equipmentInfo: {
					img: '../../../../static/u145.png',
					type: '伟迪捷-大字符喷码机-2120',

				}
			}
		},
		onLoad() {

		},
		methods: {

		}
	}
</script>

<style scoped>

	.equipment-info {
		background-cheight: 100rpx;
		olor: #FFFFFF;
		width: 90%;
	}

	.equipment-info {
		background-color: #FFFFFF;
		text-align: center;
		line-height: 100rpx;
		font-size: 28rpx;
		font-weight: 400;
		color: #999999;
	}

	.content {
		height: 100%;
		background-color: #EFEFF4;
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-between;
	}

	.img-box {
		height: 500rpx;
		width: 500rpx;
		margin: 50rpx auto;
	}

	.img {
		height: 100%;
		width: 100%;
	}

	.bottom-box {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		width: auto;
		background-color: #FFFFFF;
		margin-top: 150rpx;
		height: 190rpx;
		width: 90%;
	}

	.bottom {

		flex-grow: 1;
		width: 33.333%;
		height: 100%;
	}

	.link-box {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		color: #333333;
		width: 100%;
		height: 100%;
	}

	.bottom p {
		font-size: 28rpx;
	}

	.bottom-icon-box {}

	.img-icon {
		height: 100%;
	}

	.bottom-line {
		border-left: 2rpx solid #EAEAEA;
		border-right: 2rpx solid #EAEAEA;
	}

	.logo-box {
		margin-top: 10rpx;
		margin-bottom: 20rpx;
		line-height: 110rpx;
		background-color: #FFFFFF;
		text-align: center;
	/* 	position: absolute;
		bottom: 0; */
		width: 90%;
		height: 110rpx;
	}

	.logo-icon {
		margin-top: 10rpx;
		width: 15%;
		height: 80%;
	}

	/* 去除下划线 */
	 a {
		text-decoration: none;
	}
	
</style>
